@use '@angular/material/index' as mat;
@use '@gravitee/ui-particles-angular/index' as gio;

@use '../../../../scss/gio-layout' as gio-layout;

:host {
  @include gio-layout.gio-responsive-margin-container;
}

.apiProperties {
  &__header {
    display: flex;
    justify-content: space-between;
    align-items: center;

    &__text {
      padding-right: 48px;
    }
    &__btn {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex: 1 0 auto;
    }
  }

  &__table {
    .mat-column-actions {
      text-align: end;
      width: 182px; // two buttons
    }

    .mat-column-key,
    .mat-column-value {
      padding-right: 16px;
    }

    &__field {
      width: 100%;
    }
  }
}
